<?php if (!defined('THINK_PATH')) exit(); /*a:1:{s:35:"template/img/default/img\index.html";i:1527058502;}*/ ?>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $seo['title']; ?></title>
    <meta name="keywords" content="<?php echo $seo['keyword']; ?>">
    <meta name="description" content="<?php echo $seo['desc']; ?>">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="/static/h5/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="/static/h5/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="/static/h5/css/plugins/jsTree/style.min.css" rel="stylesheet">
    <link href="/static/h5/css/animate.css" rel="stylesheet">
    <link href="/static/h5/css/style.css?v=4.1.0" rel="stylesheet">
    <!-- Sweet Alert -->
    <link href="/static/h5/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <!-- Chosen -->
    <link href="/static/h5/css/plugins/chosen/chosen.css" rel="stylesheet">



    <style>
        /*封面*/
        .cover-img .left{width: 100px; height: 100px;
            float:left;}
        .cover-img .left i{font-size: 100px; color: #dadada}
        .cover-img .rig{float: left; padding-left: 10px;}

        .jstree-open > .jstree-anchor > .fa-folder:before {content: "\f07c";}
        .jstree-default .jstree-icon.none {  width: 0;}

        @media (min-width:768px){
            .modal-dialog{width:60%;}
            #removeModel .modal-dialog{width: 400px;}
        }

        .layui-layer-title{background: #303030!important;
            color: #a5a5a5!important;
            border-bottom:1px solid #28292a!important;}
        .layui-layer-content{background:#323334}

        .m-b{margin-bottom: 0}
    </style>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-sm-2">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <div class="file-manager">
                        <h5 class="tag-title">站点</h5>
                        <select class="form-control m-b" id="siteSelect" name="account" onchange="changeSite(this.value)">
                            <?php echo $res['siteOpt']; ?>
                        </select>
                        <h5 class="tag-title">文件夹</h5>
                        <ul class="tag-list" style="padding: 0">
                            <li><a href="javascript:demo_create()">新建</a></li>
                            <li><a href="javascript:demo_rename()">修改</a></li>
                            <li><a href="javascript:demo_delete()">删除</a></li>
                        </ul>
                        <div class="clearfix"></div>
                        <h5 class="tag-title">图片</h5>
                        <ul class="tag-list" style="padding: 0">
                            <li><a href="javascript:upload()">上传图片</a></li>
                            <li><a href="javascript:checkBox(true)">全选</a></li>
                            <li><a href="javascript:checkBox(false)">取消</a></li>
                            <li><a href="javascript:clickRemove()" >移动</a></li>
                            <li><a href="javascript:void(0)" data-toggle="modal" data-target="#imgAddress" onclick="imgPath()">图片地址</a></li>
                            <li><a href="javascript:replaceImg()">替换</a></li>

                            <li><a href="javascript:clickDelImg()">删除</a></li>
                        </ul>
                        <div class="clearfix"></div>

                        <div class="hr-line-dashed"></div>
                            <div style="padding-bottom: 10px"><input type="email" placeholder="搜索目录" class="form-control" id="folder-search"></div>
                            <div id="jstree1"></div>
                    </div>
                </div>
            </div>
        </div>
        
        <div id="imgView"></div>
    </div>
</div>

<!--隐藏层Model-->

<div class="modal inmodal" id="imgAddress" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content animated fadeIn">
            <div class="modal-body">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span>
                </button>
                <textarea style="width: 100%; height: 300px;" class="form-control required" id="pathCode"></textarea>
                <div class="btn-group" style="padding-top: 10px;">
                    <button type="button" class="btn btn-outline btn-primary" onclick="imgPathAddress(1)">Img</button>
                    <button type="button" class="btn btn-outline btn-primary" onclick="imgPathAddress(2)">Url</button>
                    <button type="button" class="btn btn-outline btn-primary" onclick="imgPathAddress(3)">相对Img</button>
                    <button type="button" class="btn btn-outline btn-primary" onclick="imgPathAddress(4)">相对Url</button>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>


<div class="modal inmodal in" id="removeModel" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog remove">
        <div class="modal-content animated fadeIn">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true" onclick="closeBtn()">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="modelTitle">移动图片</h4>
            </div>
            <div class="modal-body">
                <form role="form" name="form2" id="">
                    <div class="form-group">
                        <label>目录</label>
                        <select name="pid" id="removeOpt"  class="form-control">
                            <option>暂无目录</option>
                        </select>
                    </div>

                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="rmoveBtn()">保存</button>
            </div>
        </div>
    </div>
</div>



<!-- 全局js -->
<script src="/static/h5/js/jquery.min.js?v=2.1.4"></script>
<script src="/static/h5/js/bootstrap.min.js?v=3.3.6"></script>

<!-- jsTree plugin javascript -->
<script src="/static/h5/js/plugins/jsTree/jstree.js"  type="text/javascript"></script>

<!-- 自定义js -->
<script src="/static/h5/js/content.js?v=1.0.0"></script>

<!-- layer javascript -->
<script src="/static/h5/js/plugins/layer/layer.min.js"></script>
<!-- Sweet alert -->
<script src="/static/h5/js/plugins/sweetalert/sweetalert.min.js"></script>


<!-- Chosen -->
<script src="/static/h5/js/plugins/chosen/chosen.jquery.js"></script>

<script>
    $(document).ready(function () {
        $('.file-box').each(function () {
            //animationHover(this, 'pulse');
        });

    });


</script>
<script>
    // jsTree左侧节点ID
    //var jsTreeNodeId = "<?php echo \think\Session::get('imgSite'); ?>";
    var jsTreeNodeId;
    // 初始化载入图片
    //ajaxImg(jsTreeNodeId);
$(document).ready(function () {
    // 站点id
    //var siteId = $("#siteSelect").val();


    // jsTree
    $('#jstree1').jstree({
        'core' : {
            "animation" : 0,
            "check_callback" : true,
            'force_text' : true,
            "themes" : { "stripes" : true },
            'data' : {
                // 获取默认数据
                "url":"<?php echo url('img/imgFolder/jsTree'); ?>?pid=6",
                "dataType" : "json",
                "data" : function (node) {
                    //console.log(node.id)
                    //return { "id" : node.id };
                },
                "success":function(result){
                    //console.log(result)
                }
            }
        },
        // 拖动，搜索，是否显示子类，类型，显示节点快级，排序
        "plugins" : [ "dnd", "search", "state", "types", "wholerow","sort" ],
        // 排序
        "sort" : function(a, b) {
                return this.get_type(a) === this.get_type(b) ? (this.get_text(a) > this.get_text(b) ? 1 : -1) : (this.get_type(a) >= this.get_type(b) ? 1 : -1);
         }
    });

    // 刷新界面重新获取默认节点参数（上一次点击的节点）
    $( "#jstree1" ).on('changed.jstree', function (e, data) {
        //console.log(data)
        if(data && data.selected && data.selected.length) {
            jsTreeNodeId = data.selected.join(':');
            ajaxImg(jsTreeNodeId)
        }else {
            jsTreeNodeId =''
        }
        ajaxImg(jsTreeNodeId)
    });


    // 查询目录
    var to = false;
    $('#folder-search').keyup(function () {
        if(to) { clearTimeout(to); }
        to = setTimeout(function () {
            var v = $('#folder-search').val();
            $('#jstree1').jstree(true).search(v);
        }, 250);
    });



    // 拖动更改分类属性
    $( "#jstree1" ).on('move_node.jstree', function(e,data){
        //console.info(data);
        $.ajax({
            url:"<?php echo url('img/imgFolder/ajaxEdit'); ?>",
            data:{id : data.node.id,pid : data.parent},
            success:function(res){
                if(res.code!=200)alert(res.msg);
            },error:function(){
                alert("Ajax Error");
            }
        })
   })

    // 点击分页获取数据
    $("#imgView").on('click','.ajaxPage li a',function(){
        var url = $(this).attr('href');
        //console.log(url);
        $.ajax({
            url:url,
            success:function(res){
                //alert(res);
                $("#imgView").html(res);
            },error:function(){
                parent.layer.msg('Error:点击分页出现故障')
            }
        })
        return false;
    })


    // 点击节点 显示右侧图片
   $('#jstree1').bind("activate_node.jstree", function (obj, e) {
       var currentNode = e.node;
       var id =currentNode.id;
       //alert(id);
       // 重新赋值给父节点
       parent.jsTreeNodeId = id;
       //console.log(id);

       ajaxImg(id);

   });

});

// change站点
function changeSite(v){
    $.ajax({
        //url:"<?php echo url('imgSite/ajaxSession'); ?>",
        //data:{'v':v},
        url:"<?php echo url('imgSite/changeSite'); ?>",
        data:{'id':v},
        success:function(res){
            //console.log(res);
            if(res.code==200){
                // 重新赋值给父节点
                //alert(res.data.folder.id)
                parent.jsTreeNodeId = res.data.folder.id;
                window.location.href="<?php echo url('img/index'); ?>"
            }
        },error:function(){
            parent.layer.msg('网络出现故障');
        }
    });
}

// ajax 获取图片
function ajaxImg(id){
    //console.log(id)
    //alert(id);
    //alert(id);
    $.ajax({
        url:"<?php echo url('img/img/lists'); ?>",
        data:{'pid':id},
        cache: false,
        success:function(res){
            //alert(res);
            //console.log(res)
            $("#imgView").html(res);
        }
    })
    //console.log(id)
    parent.jsTreeNodeId = id;
    //console.log(id);
}

// 获取图片选中Id
function checkBoxId(){
    var input = document.getElementsByName("imgId[]");
    var length = input.length;
    var arr = new Array;
    var ii=0;
    for(var i=0;i<length;i++){
        if(input[i].checked ==true){
            arr[ii] = input[i].value
            ii++;
        }

    }
    //console.log(jsTreeNodeId);
    //  数组转字符串
    var str = arr.join(",");
    // str 格式：1,2,3
    //console.log(arr.length);
    return str;
}

// click 图片删除
function clickDelImg(){
    // id 格式：1,2,3
    var id = checkBoxId();
    if(id.length<1){
        parent.layer.msg('请选择图片');
        return false;
    }
    swal({
        title: "您确定要删除这条信息吗",
        text: "删除后将无法恢复，请谨慎操作！",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "是的，我要删除！",
        cancelButtonText: "让我再考虑一下…",
        closeOnConfirm: false
    }, function () {
        //swal("删除成功！", "您已经永久删除了这条信息。", "success");

        // 执行删除
        ajaxDelImg(id);
    });

}

// ajax 删除图片
function ajaxDelImg(str){
    //console.log(jsTreeNodeId);
    //加载层
    //var index = parent.layer.load(2, {shade: false}); //0代表加载的风格，支持0-2
    var index = layer.load(2);
    $.ajax({
        url:"<?php echo url('img/ajaxDelImg'); ?>",
        data:{"id":''+str+''},
        success:function(res){
            //console.log(res);
            if(res.code ==200){
                //alert(nodeId);
                layer.close(index);
                //alert(1)
                // 右侧重新获取图片
                ajaxImg(jsTreeNodeId);
                swal("删除成功！", "您已经永久删除了这条信息。", "success")
            }else{
                parent.layer.msg(res.msg);
            }
        },error:function(){
            parent.layer.msg('网络出现故障');
        }
    });

}

// 存在图片路径
var imgPathArray;
// 图片地址 列表
function imgPath(){
    //alert(imgPathArray);
    var id = checkBoxId();
    $.ajax({
        url:"<?php echo url('img/img/ajaxImgPath'); ?>",
        data:{"id":id},
        success:function(res){
            //console.log(res);
            //parent.imgPathArray = res;
            imgPathArray = res;
            //$("#pathCode").html('1');
            imgPathAddress(1);
        },error:function(){
            parent.layer.msg('网络出现故障');
        }
    })
    //alert(id);
    //console.log(id);
}

/*
* 转url或者img
* 1,<img sr="http://images.imgwn.com/20180417_a15d6302c6669a5d7552c8703db612a6.jpg"/>
* 2,http://images.imgwn.com/20180418_fd51f8f16eeee05e679cfd67c56a50fa.jpg
* 3,/uploads/images/20180418_0ddec87d24360f17f1897403ff7a45da.jpg
* */
function imgPathAddress(a){
    //console.log(imgPathArray);
    var str='';
    var length = imgPathArray.length;
    if(length<1){
        parent.layer.msg('请选中图片');
        $("#pathCode").html('暂无数据');
        return false
    }

    if(a==1){
        for(i=0;i<imgPathArray.length;i++){
            str +='<img sr="<?php echo config("img.domain"); ?>'+imgPathArray[i]+'"/>\n';
            //console.log(i);
        }
    }else if(a==2){
        for(i=0;i<imgPathArray.length;i++){
            str +="<?php echo config("img.domain"); ?>"+imgPathArray[i]+'\n';
            //console.log(i);
        }
    }else if(a==3){
        for(i=0;i<imgPathArray.length;i++){
            //str +="/<?php echo UPLOADS_IMAGES; ?>"+imgPathArray[i]+'\n';
            str +='<img sr="/<?php echo UPLOADS_IMAGES; ?>'+imgPathArray[i]+'"/>\n';
            //console.log(i);
        }
    }else{
        for(i=0;i<imgPathArray.length;i++){
            str +="/<?php echo UPLOADS_IMAGES; ?>"+imgPathArray[i]+'\n';
            //console.log(i);
        }
    }

    //console.log(imgPathArray.length);
    $("#pathCode").html(str);
}

// 上传
function upload(){
    //alert(1);
    var ref = $('#jstree1').jstree(true), sel = ref.get_selected();
    if(!sel.length) {
        parent.layer.msg('请选中目录');
        return false;
    }
    sel = sel[0];
    //alert(sel);

    window.open('<?php echo url("img/upload"); ?>?pid='+sel,'','width=750,height=565,top=205,left=220,toolbar=no, menubar=no, scrollbars=no, resizable=no');
    //window.open('<?php echo url("img/upload",array("pid"=>'+s+')); ?>');
    //window.open('<?php echo url("img/upload"); ?>?pid='+sel);
}
// 替换图片
function replaceImg(){
    // 字符串格式
    var str = checkBoxId();
    // 字符串转数组
    var arr= str.split(',');
    var id = arr[0];
    if(arr.length>1){
        parent.layer.msg('只能选中1个');
        return false;
    }
    // 如有没有值则弹窗
    if(id==''){
        parent.layer.msg('请选中图片');
        return false
    }
    window.open('<?php echo url("img/replace_img"); ?>?id='+id,'','width=750,height=565,top=205,left=220,toolbar=no, menubar=no, scrollbars=no, resizable=no');
}

// 移动图片
function clickRemove(){
    // 字符串格式
    var str = checkBoxId();
    //console.log(str);

    if(str==''){
        parent.layer.msg('请选中图片');
        return false
    }else{
        $('#removeModel').modal({
            keyboard: false
        })
        $.ajax({
            url:"<?php echo url('img/imgFolder/ajaxOpt'); ?>",

            success:function(res){
                //console.log(res);
                $("#removeOpt").html(res);
            },error:function(){

            }
        })
    }
}

//
function rmoveBtn(){
    // 字符串格式
    var str = checkBoxId();
    //console.log(str);

    var pid = form2.pid.value;

    if(str==''){
        parent.layer.msg('请选中图片');
        return false
    }else{
        $('#removeModel').modal('show')
        $.ajax({
            url:"<?php echo url('img/img/doRemovePid'); ?>",
            data:{"pid":pid,"id":str},
            success:function(res){
                //console.log(res);
                if(res.code==200){
                    parent.layer.msg(res.msg);
                    $('#removeModel').modal('hide')
                }
                //console.log(res);
            },error:function(){

            }
        })
    }
}

// 全选
function checkBox(obj){
    var input = document.getElementsByName("imgId[]");
    var length = input.length;
    if(obj==true){
        for(i=0;i<length;i++){
            input[i].checked = true;
        }
    }else{
        for(i=0;i<length;i++){
            input[i].checked = false;
        }
    }
}

// 创建
function demo_create() {
    var ref = $('#jstree1').jstree(true), sel = ref.get_selected();
    if(!sel.length) { return false; }
    sel = sel[0];
    var id = sel;   // 父级id

    sel = ref.create_node(sel, {"type":"file"});
    var defaultName = '新建文件夹'
    if(sel){
        ref.edit(sel,defaultName,function(){
            var name = ref.get_text(sel);
            $.ajax({
                url:"<?php echo url('img/imgFolder/ajaxAdd'); ?>",
                data:{'id':id,'name':name},
                success:function(res){
                    if(res.code!=200){

                        parent.layer.msg(res.msg);
                    }
                },error:function(){
                    parent.layer.msg('网络出现故障');
                }
            });

        });
    }
}
//更名
function demo_rename() {
    var ref = $('#jstree1').jstree(true);
    sel = ref.get_selected();
    if(!sel.length) { return false; }
    sel = sel[0];
    ref.edit(sel,ref.get_text(sel),function(){
        var name = ref.get_text(sel);
        $.ajax({
            url:"<?php echo url('img/imgFolder/ajaxEdit'); ?>",
            data:{'id':sel,'name':name},
            success:function(res){
                if(res.code ==100){
                    parent.layer.msg(res.msg);

                }
            },error:function(){
                parent.layer.msg('网络出现故障');
            }
        })
    });
}

function demo_delete(){
    var ref = $('#jstree1').jstree(true);
    var sel = ref.get_selected();
    if(!sel.length) { return false; }
    var id = sel[0]
    swal({
        title: "您确定要删除吗",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "是的，我要删除！",
        cancelButtonText: "让我再考虑一下…",
        closeOnConfirm: false
    }, function () {
        $.ajax({
            url:"<?php echo url('img/imgFolder/ajaxdel'); ?>",
            data:{'id':id},
            success:function(res){
                //console.log(res)
                if(res.code ==200){
                    ref.delete_node(id);
                    swal("删除成功！", "您已经永久删除了这条信息。", "success")
                }else{
                    //parent.layer.msg(res.msg);
                    swal('', "删除失败", "error")
                }
            },
            error:function(){
                //parent.layer.msg('网络出现故障');
                swal('', "网络出现故障。", "error")
            }
        });

    });
}

// 删除
function demo_delete2() {
    //alert(1)
    var ref = $('#jstree1').jstree(true);
    var sel = ref.get_selected();
    if(!sel.length) { return false; }
    var r=confirm("确定删除?")
    swal("删除成功！", "您已经永久删除了这条信息。", "success")
    //console.log(sel[0])
    var id = sel[0]
    if (r==true)
    {
        $.ajax({
            url:"<?php echo url('img/imgFolder/ajaxdel'); ?>",
            data:{'id':id},
            success:function(res){
                //console.log(res)
                if(res.code ==200){
                    ref.delete_node(id);
                }else{
                    parent.layer.msg(res.msg);
                }
            },
            error:function(){
                parent.layer.msg('网络出现故障');
            }
        });
    }
}

// click name
function changeName(id,val){
    $.ajax({
        url:"<?php echo url('img/img/ajaxEditName'); ?>?id="+id+"&name="+val,
        data:{'id':id,'name':val},
        success:function(res){
            //console.log(res);
            if(res!=1)parent.layer.msg('修改失败');
        },error:function(){
            parent.layer.msg('网络出现故障');
        }
    });
}



</script>
</body>
</html>
